<template>
  <div class="plusWrap">
    <div
      v-show="list_show"
      class="plus"
      @click="show_click"
    >
      <img src="../static/section/btn_pop@2x.png">
    </div>
    <van-popup
      v-model="show"
      position="right"
      :style="{ right:'8vw',top:'78vh', borderRadius:'20px',padding:'5px 0px',background:'rgba(255, 255, 255, 0.1)'}"
    >
      <div @click="show_release">
        <b style="font-size:15px">任务</b>
        <span class="public"><img src="../static/section/task_icon@2x.png"></span>
      </div>
      <div @click="show_apply" >
        <b style="font-size:15px">积分</b> <span class="public"> <img src="../static/section/integral_icon@2x.png"></span>
      </div>
      <div @click="show_fabulous">
        <b style="font-size:15px">点赞</b> <span class="public"><img src="../static/section/like_icon@2x.png"></span>
      </div>
      <!--to="/test":to="{path:'/test',query:{showmenu:false}}"-->
      <!-- <van-cell  background:'#dcdcdc29'
          title="点赞送福"
          :style="{borderBottom:'1px solid #F8F4F4'}"
          ref="fabulous"
          :to="{path:'/test',query:{showmenu:false}}"
        /> -->
      <!-- to="/release" -->
      <!-- <van-cell
          title="发布任务"
          :style="{borderBottom:'1px solid #F8F4F4'}"
          ref="release"
          :to="{path:'/release',query:{showmenu:false}}"
        /> -->
      <!-- to="/apply" -->
      <!-- <van-cell
          title="积分申请"
          :style="{borderBottom:'1px solid #F8F4F4'}"
          :to="{path:'/apply',query:{showmenu:false}}"
          ref="apply"
        /> -->
    </van-popup>

  </div>

</template>
<script>
import { Popup } from "vant";
export default {
  data() {
    return {
      show: false,
      list_show: true
    };
  },
  components: {
    [Popup.name]: Popup
  },

  methods: {
    show_click() {
      this.show = true;
    },
    // 跳转点赞
    show_fabulous() {
      this.$router.push({
        //核心语句
        path: "/test", //跳转的路径
      });
    },
    // 跳转发布任务
    show_release() {
      this.$router.push({
        //核心语句
        path: "/release", //跳转的路径
      });
    },
    // 跳转积分申请
    show_apply() {
      this.$router.push({
        //核心语句
        path: "/apply", //跳转的路径
      });
    }
  }
};
</script>
<style lang="less" scoped>
.plusWrap {
  position: fixed;
  bottom: 82px;
  right: 6vw;
  z-index: 2;
  /deep/ .van-overlay {
    background-color: #dcdcdcd9;
    opacity: 0.8;
  }
  .plus img {
    width: 57px;
    height: 57px;
    z-index: 1;
  }
  .public {
    display: inline-block;
    width: 55px;
    height: 55px;
  }
  .public img {
    vertical-align: middle;
    width: 100%;
    height: 100%;
  }
}
</style>